<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core">

<ui:composition template="template.xhtml">
	<ui:define name="header">
	    <h2>Ejemeplo</h2>
	</ui:define>
	<ui:define name="content">
		<h:form id="frmX">
			<h:panelGrid columns="2">
  			<f:facet name="header">
     		   Calculadora
    		</f:facet>
			
			<h:outputLabel for="op1" value="Operador 1" />
			<h:inputText id="op1" value="#{calcBean.operador1}" required="true"  />
			
			<h:outputLabel for="op2" value="Operador 2" />
			<h:inputText id="op2" value="#{calcBean.operador2}" required="true"  />
			
			<h:outputLabel for="result" value="Resultado" />
			<h:outputText id="result" value="#{calcBean.resultado}" required="true"  />
			
   			 <f:facet name="footer">
				<h:commandButton id="btnCalcular" value="Operar !! " action="#{calcBean.sumar}" ajax="false" />
    		</f:facet>
    		</h:panelGrid>
		</h:form>
	</ui:define>
	<ui:define name="footer">
		<ui:include src="pie.xhtml" />
	</ui:define>
</ui:composition>
</html>